$prefix-class: daterangepicker;
$arrow-size:		 7px !default;

//
// Colors
$daterangepicker-color: inherit !default;
$daterangepicker-bg-color: #fff !default;

$daterangepicker-cell-color: $daterangepicker-color !default;
$daterangepicker-cell-border-color: transparent !default;
$daterangepicker-cell-bg-color: $daterangepicker-bg-color !default;

$daterangepicker-cell-hover-color: $daterangepicker-color !default;
$daterangepicker-cell-hover-border-color: $daterangepicker-cell-border-color !default;
$daterangepicker-cell-hover-bg-color: $blue_e !default;

$daterangepicker-in-range-color: #000 !default;
$daterangepicker-in-range-border-color: transparent !default;
$daterangepicker-in-range-bg-color: #ebf4f8 !default;

$daterangepicker-active-color: #fff !default;
$daterangepicker-active-bg-color: $blue !default;
$daterangepicker-active-border-color: transparent !default;

$daterangepicker-unselected-color: $blue_9 !default;
$daterangepicker-unselected-border-color: transparent !default;
$daterangepicker-unselected-bg-color: #fff !default;

//
// daterangepicker
$daterangepicker-width: 278px !default;
$daterangepicker-padding: 3px !default;
$daterangepicker-z-index: 3000 !default;

$daterangepicker-border-size: 1px !default;
$daterangepicker-border-color: $blue_e !default;
$daterangepicker-border-radius: 3px !default;


//
// Calendar
$daterangepicker-calendar-margin: $daterangepicker-padding !default;
$daterangepicker-calendar-bg-color: $daterangepicker-bg-color !default;

$daterangepicker-calendar-border-size: 1px !default;
$daterangepicker-calendar-border-color: $daterangepicker-bg-color !default;
$daterangepicker-calendar-border-radius: $daterangepicker-border-radius !default;

//
// Calendar Cells
$daterangepicker-cell-size: 20px !default;
$daterangepicker-cell-width: $daterangepicker-cell-size !default;
$daterangepicker-cell-height: $daterangepicker-cell-size !default;

$daterangepicker-cell-border-radius: $daterangepicker-calendar-border-radius !default;
$daterangepicker-cell-border-size: 1px !default;

//
// Dropdowns
$daterangepicker-dropdown-z-index: $daterangepicker-z-index + 1 !default;

//
// Controls
$daterangepicker-control-height: 30px !default;
$daterangepicker-control-line-height: $daterangepicker-control-height !default;
$daterangepicker-control-color: $gray !default;

$daterangepicker-control-border-size: 1px !default;
$daterangepicker-control-border-color: $blue_e !default;
$daterangepicker-control-border-radius: 3 !default; 

$daterangepicker-control-active-border-size: 1px !default;
$daterangepicker-control-active-border-color:	$blue !default;
$daterangepicker-control-active-border-radius: $daterangepicker-control-border-radius !default;

$daterangepicker-control-disabled-color: $blue_e !default;

//
// Ranges
$daterangepicker-ranges-color: $blue !default;
$daterangepicker-ranges-bg-color: #f5f5f5 !default;

$daterangepicker-ranges-border-size: 1px !default;
$daterangepicker-ranges-border-color: $daterangepicker-ranges-bg-color !default;
$daterangepicker-ranges-border-radius: $daterangepicker-border-radius !default;

$daterangepicker-ranges-hover-color: #fff !default;
$daterangepicker-ranges-hover-bg-color: $daterangepicker-ranges-color !default;
$daterangepicker-ranges-hover-border-size: $daterangepicker-ranges-border-size !default;
$daterangepicker-ranges-hover-border-color: $daterangepicker-ranges-hover-bg-color !default;
$daterangepicker-ranges-hover-border-radius: $daterangepicker-border-radius !default;

$daterangepicker-ranges-active-border-size:  $daterangepicker-ranges-border-size !default;
$daterangepicker-ranges-active-border-color: $daterangepicker-ranges-bg-color !default;
$daterangepicker-ranges-active-border-radius: $daterangepicker-border-radius !default;

//
// STYLESHEETS
//
.#{$prefix-class} {
	position: absolute;
	color: $daterangepicker-color;
	background: $daterangepicker-bg-color;
	border-radius: $daterangepicker-border-radius;
	width: $daterangepicker-width;
	padding: 10px;
	margin-top: $daterangepicker-border-size;
	top: 100px;
	left: 20px;
	
	&.ui-datepicker {
		width: 306px;
		
		.range_inputs {
			padding:  10px 0 0;
			text-align: center;
		}
	}
	
	&.ui-timerange {
		.input-mini {
			padding: 0 10px;
		}
		
		.calendar-time {
			padding: 0 0 10px;
			text-align: left;
		}
		
		.range_inputs {
			padding:  0;
		}
		
		.glyphicon {
			display: none;
		}
		
		.calendar-table {
			display: none;
		}
	}

	&:before, &:after {
		display: none;
	}
		
	.table-condensed > thead > tr > th, .table-condensed > thead > tr > td, .table-condensed > tbody > tr > th, .table-condensed > tbody > tr > td, .table-condensed > tfoot > tr > th, .table-condensed > tfoot > tr > td {
		padding: 5px;
	}
	
	&.dropdown-menu {
		max-width: none;
		z-index: $daterangepicker-dropdown-z-index;
	}

	&.single {
		.ranges, .calendar {
			float: none;
		}
	}

	/* Calendars */
	&.show-calendar {
		.calendar {
			display: block;
		}
	}

	.calendar {
		display: none;
		max-width: $daterangepicker-width - ($daterangepicker-calendar-margin * 2);
		margin: $daterangepicker-calendar-margin;

		&.single {
			.calendar-table {
				border: none;
			}
		}

		th, td {
			white-space: nowrap;
			text-align: center;

			// TODO: Should this actually be hard-coded?
			min-width: 32px;
		}
	}

	.calendar-table {
		border: $daterangepicker-calendar-border-size solid $daterangepicker-calendar-border-color;
		padding: $daterangepicker-calendar-margin;
		border-radius: $daterangepicker-calendar-border-radius;
		background: $daterangepicker-calendar-bg-color;
	}

	table {
		width: 100%;
		margin: 0;
	}

	td, th {
		text-align: center;
		width: $daterangepicker-cell-width;
		height: $daterangepicker-cell-height;
		border-radius: $daterangepicker-cell-border-radius;
		border: $daterangepicker-cell-border-size solid $daterangepicker-cell-border-color;
		white-space: nowrap;
		cursor: pointer;

		&.available {
			&:hover {
				background-color: $daterangepicker-cell-hover-bg-color;
				border-color: $daterangepicker-cell-hover-border-color;
				color: $daterangepicker-cell-hover-color;
			}
		}

		&.week {
			font-size: 80%;
			color: #ccc;
		}
	}

	td {
		&.off {
			&, &.in-range, &.start-date, &.end-date {
				background-color: $daterangepicker-unselected-bg-color;
				border-color: $daterangepicker-unselected-border-color;
				color: $daterangepicker-unselected-color;
			}
		}

		//
		// Date Range
		&.in-range {
			background-color: $daterangepicker-in-range-bg-color;
			border-color: $daterangepicker-in-range-border-color;
			color: $daterangepicker-in-range-color;

			// TODO: Should this be static or should it be parameterized?
			border-radius: 0;
		}

		&.start-date {
			border-radius: $daterangepicker-cell-border-radius 0 0 $daterangepicker-cell-border-radius;
		}

		&.end-date {
			border-radius: 0 $daterangepicker-cell-border-radius $daterangepicker-cell-border-radius 0;
		}

		&.start-date.end-date {
			border-radius: $daterangepicker-cell-border-radius;
		}

		&.active {
			&, &:hover {
				background-color: $daterangepicker-active-bg-color;
				border-color: $daterangepicker-active-border-color;
				color: $daterangepicker-active-color;
			}
		}
	}

	th {
		&.month {
			width: auto;
		}
	}

	//
	// Disabled Controls
	//
	td, option {
		&.disabled {
			color: #999;
			cursor: not-allowed;
			text-decoration: line-through;
		}
	}

	select {
		&.monthselect, &.yearselect {
			font-size: 12px;
			padding: 1px;
			height: auto;
			margin: 0;
			cursor: default;
		}

		&.monthselect {
			margin-right: 2%;
			width: 56%;
		}

		&.yearselect {
			width: 40%;
		}

		&.hourselect, &.minuteselect, &.secondselect, &.ampmselect {
			width: 50px;
			margin-bottom: 0;
		}
	}

	//
	// Text Input Controls (above calendar)
	//
	.input-mini {
		border: $daterangepicker-control-border-size solid $daterangepicker-control-border-color;
		border-radius: $daterangepicker-control-border-radius;
		color: $daterangepicker-control-color;
		height: $daterangepicker-control-line-height;
		line-height: $daterangepicker-control-height;
		display: block;
		vertical-align: middle;
		box-sizing: border-box;
		margin: 0 0 5px 0;
		padding: 0 6px 0 28px;
		width: 100%;
		
		/*
		&.active {
			border: $daterangepicker-control-active-border-size solid $daterangepicker-control-active-border-color;
			border-radius: $daterangepicker-control-active-border-radius;
		}
		*/
	}

	.daterangepicker_input {
		position: relative;

		i {
			position: absolute;

			// NOTE: These appear to be eyeballed to me...
			left: 8px;
			top: 8px;
		}
	}
	&.rtl {
		.input-mini {
			padding-right: 28px;
			padding-left: 6px;
		}
		.daterangepicker_input i {
			left: auto;
			right: 8px;
		}
	}

	//
	// Time Picker
	//
	.calendar-time {
		text-align: center;
		margin: 5px auto;
		line-height: $daterangepicker-control-line-height;
		position: relative;
		padding-left: 28px;

		select {
			&.disabled {
				color: $daterangepicker-control-disabled-color;
				cursor: not-allowed;
			}
		}
	}
}

.ranges {
	font-size: 11px;
	float: none;
	margin: 4px;
	text-align: left;

	ul {
		list-style: none;
		margin: 0 auto;
		padding: 0;
		width: 100%;
	}

	li {
		font-size: 13px;
		background: $daterangepicker-ranges-bg-color;
		border: $daterangepicker-ranges-border-size solid $daterangepicker-ranges-border-color;
		border-radius: $daterangepicker-ranges-border-radius;
		color: $daterangepicker-ranges-color;
		padding: 3px 12px;
		margin-bottom: 8px;
		cursor: pointer;

		&:hover {
			background: $daterangepicker-ranges-hover-bg-color;
			border: $daterangepicker-ranges-hover-border-size solid $daterangepicker-ranges-hover-border-color;
			color: $daterangepicker-ranges-hover-color;
		}

		&.active {
			background: $daterangepicker-ranges-hover-bg-color;
			border: $daterangepicker-ranges-hover-border-size solid $daterangepicker-ranges-hover-border-color;
			color: $daterangepicker-ranges-hover-color;
		}
	}
}





/*
$bs-datetimepicker-timepicker-font-size: 1.2em !default;
$bs-datetimepicker-active-bg: $btn-primary-bg !default;
$bs-datetimepicker-active-color: $btn-primary-color !default;
$bs-datetimepicker-border-radius: $border-radius-base !default;
$bs-datetimepicker-btn-hover-bg: $gray-lighter !default;
$bs-datetimepicker-disabled-color: $gray-light !default;
$bs-datetimepicker-alternate-color: $gray-light !default;
$bs-datetimepicker-secondary-border-color: #ccc !default;
$bs-datetimepicker-secondary-border-color-rgba: rgba(0, 0, 0, 0.2) !default;
$bs-datetimepicker-primary-border-color: white !default;
$bs-datetimepicker-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) !default;

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0,0,0,0);
	border: 0;
}

.bootstrap-datetimepicker-widget {
	list-style: none;

	&.dropdown-menu {
		margin: 2px 0;
		padding: 4px;
		width: 300px;
		
		.table-condensed {
			width: 100%;
		}
		
		.table-condensed > thead > tr > th, .table-condensed > thead > tr > td, .table-condensed > tbody > tr > th, .table-condensed > tbody > tr > td, .table-condensed > tfoot > tr > th, .table-condensed > tfoot > tr > td {
			padding: 6px;
		}

		&:before, &:after {
			display: none;
		}
	}
	
	.timepicker-hours,
	.timepicker-minutes,
	.timepicker-seconds {
		padding: 15px 0 0 5px;
		text-align: center;
	}

	
	&.timepicker-sbs {
		width: 470px;
		
		.col-md-6 {
			float: left;
		}
		
		.timepicker {
			width: 100px;
		}
	}

	.list-unstyled {
		margin: 0;
	}

	a[data-action] {
		padding: 6px 0;
	}

	a[data-action]:active {
		box-shadow: none;
	}

	.timepicker-hour, .timepicker-minute, .timepicker-second {
		width: 54px;
		font-weight: bold;
		font-size: $bs-datetimepicker-timepicker-font-size;
		margin: 0;
	}

	button[data-action] {
		padding: 6px;
	}

	.btn[data-action="incrementHours"]::after {
		@extend .sr-only;
		content: "Increment Hours";
	}

	.btn[data-action="incrementMinutes"]::after {
		@extend .sr-only;
		content: "Increment Minutes";
	}

	.btn[data-action="decrementHours"]::after {
		@extend .sr-only;
		content: "Decrement Hours";
	}

	.btn[data-action="decrementMinutes"]::after {
		@extend .sr-only;
		content: "Decrement Minutes";
	}

	.btn[data-action="showHours"]::after {
		@extend .sr-only;
		content: "Show Hours";
	}

	.btn[data-action="showMinutes"]::after {
		@extend .sr-only;
		content: "Show Minutes";
	}

	.btn[data-action="togglePeriod"]::after {
		@extend .sr-only;
		content: "Toggle AM/PM";
	}

	.btn[data-action="clear"]::after {
		@extend .sr-only;
		content: "Clear the picker";
	}

	.btn[data-action="today"]::after {
		@extend .sr-only;
		content: "Set the date to today";
	}

	.picker-switch {
		text-align: center;

		&::after {
			@extend .sr-only;
			content: "Toggle Date and Time Screens";
		}

		td {
			padding: 0;
			margin: 0;
			height: auto;
			width: auto;
			line-height: inherit;

			span {
				line-height: 2.5;
				height: 2.5em;
				width: 100%;
			}
		}
	}

	table {
		width: 100%;
		margin: 0;


		& td,
		& th {
			text-align: center;
			border-radius: $bs-datetimepicker-border-radius;
		}

		& th {
			height: 20px;
			line-height: 20px;
			width: 20px;
			font-weight: bold;

			&.picker-switch {
				width: 145px;
			}

			&.disabled,
			&.disabled:hover {
				background: none;
				color: $bs-datetimepicker-disabled-color;
				cursor: not-allowed;
			}

			&.prev::after {
				@extend .sr-only;
				content: "Previous Month";
			}

			&.next::after {
				@extend .sr-only;
				content: "Next Month";
			}
		}

		& thead tr:first-child th {
			cursor: pointer;

			&:hover {
				background: $bs-datetimepicker-btn-hover-bg;
			}
		}

		& td {
			height: 54px;
			line-height: 54px;
			width: 54px;

			&.cw {
				font-size: .8em;
				height: 20px;
				line-height: 20px;
				color: $bs-datetimepicker-alternate-color;
			}

			&.day {
				height: 20px;
				line-height: 20px;
				width: 20px;
			}

			&.day:hover,
			&.hour:hover,
			&.minute:hover,
			&.second:hover {
				background: $bs-datetimepicker-btn-hover-bg;
				cursor: pointer;
			}

			&.old,
			&.new {
				color: $bs-datetimepicker-alternate-color;
			}

			&.today {
				position: relative;

				&:before {
					content: '';
					display: inline-block;
					border: 0 0 7px 7px solid transparent;
					border-bottom-color: $bs-datetimepicker-active-bg;
					border-top-color: $bs-datetimepicker-secondary-border-color-rgba;
					position: absolute;
					bottom: 4px;
					right: 4px;
				}
			}

			&.active,
			&.active:hover {
				background-color: $bs-datetimepicker-active-bg;
				color: $bs-datetimepicker-active-color;
				text-shadow: $bs-datetimepicker-text-shadow;
			}

			&.active.today:before {
				border-bottom-color: #fff;
			}

			&.disabled,
			&.disabled:hover {
				background: none;
				color: $bs-datetimepicker-disabled-color;
				cursor: not-allowed;
			}

			span {
				display: inline-block;
				width: 54px;
				height: 54px;
				line-height: 54px;
				margin: 2px 1.5px;
				cursor: pointer;
				border-radius: $bs-datetimepicker-border-radius;

				&:hover {
					background: $bs-datetimepicker-btn-hover-bg;
				}

				&.active {
					background-color: $bs-datetimepicker-active-bg;
					color: $bs-datetimepicker-active-color;
					text-shadow: $bs-datetimepicker-text-shadow;
				}

				&.old {
					color: $bs-datetimepicker-alternate-color;
				}

				&.disabled,
				&.disabled:hover {
					background: none;
					color: $bs-datetimepicker-disabled-color;
					cursor: not-allowed;
				}
			}
		}
	}

	&.usetwentyfour {
		td.hour {
			height: 27px;
			line-height: 27px;
		}
	}
}

.input-group.date {
	& .input-group-addon {
		cursor: pointer;
	}
}
*/